<template>
  <el-container>
    <el-main style="background-color: #fff">
      <el-table :data="tableData" border>
        <el-table-column
          prop="username"
          label="登入账户"
          width="140"
        ></el-table-column>
        <el-table-column
          prop="lastLogin.ip"
          label="上次登入ip"
          width="120"
        ></el-table-column>
        <el-table-column
          prop="lastLogin.loginTime"
          label="上次登入时间"
          width="120"
        ></el-table-column>
        <el-table-column
          prop="nowLogin.ip"
          label="本次登入ip"
          width="120"
        ></el-table-column>
        <el-table-column
          prop="nowLogin.loginTime"
          label="本次登入时间"
        ></el-table-column>
      </el-table>
    </el-main>
  </el-container>
</template>

<style lang="less" scoped>
// /deep/.el-dropdown-menu__item {
//   width: 150px;
//   background: linear-gradient(90deg, #4c4eff, #3e3ae9, #3935df);
//   border-top: 1px solid white;
//   color: #fff;
//   font-weight: bold;
//   text-align: center;
//   span {
//     font-size: 15px;
//     margin-right: 5px;
//   }
// }

// .el-header {
//   //   background-color: #b3c0d1;
//   color: white;
//   line-height: 55px;
// }

.el-table {
  border: 1px solid #ebeef5;
}
// .el-table-td{
// border:1px solid #ebeef5
// }
</style>

<script>
import * as api from "@/api/permission";

export default {
  id: "1",
  meta: {
    name: "管理首页",
    title: "glsy",
    icon: "iconfont icon-shouye1",
  },

  data() {
    // const item = {
    //   name: "admin",
    //   date: "2016/05/02",
    //   ip: "66666666666",
    // };
    // return {
    //   tableData: Array(20).fill(item),
    // };
    return {
      tableData: [],
    };
  },
  computed: {},
  mounted() {
    api.getLoginLog().then((res) => {
      console.log(res);
      if (res.data.state) {
        this.tableData = res.data.data;
      }
    });
  },
};
</script>
